@charset "utf-8";
/* CSS Document */

.contentbg{
	width:85%;
	height:1800px;
	margin-left:auto;
	margin-right:auto;
}

.content1{
	width:36%;
	height:auto;
	margin-left:8%;
	margin-bottom:10%;
	float:left;
}

.content1 img{
	width:100%;
	height:auto;
	overflow:hidden;
	margin-bottom:5px;
}

.content2{
	width:43%;
	height:auto;
	border:5px solid #666;
	float:left;
	margin-top:10%;
	margin-left:7%;
	margin-bottom:20px;
}

.title{
	width:100%;
	height:50px;
	margin-top:10%;
}

.title h1{
	font-family: 'Open Sans Condensed', sans-serif;
	font-size:38px;
	font-weight:400;
	color:#333;
	float:right;
	margin-right:15%;
}

.text1{
	width:85%;
	height:auto;
	margin:0 auto;
	margin-top:10%;
	margin-bottom:40px;
}

.text1 p{
	font-family: 'Roboto Condensed', sans-serif;
	font-size:16px;
	font-weight:400;
	padding:5px 15px 30px 15px;
	color:#333;
	overflow-wrap:break-word;
	word-wrap: break-word;
	-ms-word-break: break-all;
  	word-break: break-all;
  	word-break: break-word;
	line-height:25px;
	text-align:justify;
}

.text1 h2{
	font-family: 'Open Sans Condensed', sans-serif;
	font-size:22px;
	font-weight:400;
	color:#333;
	margin-left:10px;
	margin-top:-10px;
}

.content3 {
	width:100%;
	height:auto;
	float:left;
	margin-top:6%;
	margin-left:auto;
	margin-right:auto;
}

.content3 img{
	width:80%;
	height:auto;
	margin-left:10%;
	border:3px solid #000; 
	margin-bottom:5%;
}

	
@media screen and (max-width: 1920px) and (min-width: 1600px) {
	.contentbg{
		width:90%;
		height:2800px;
	}
	
	.content1{
		width:33%;
		height:auto;
		float:left;	
		margin-left:13%;
	}
	
	.content2{
		width:33%;
		height:auto;
		float:left;
	}
	
	.content3 {
		width:90%;
		margin-left:auto;
		margin-right:auto;
		margin-top:0px;
		float:none;
	}
	
	.content3 img{
		width:65%;
		margin-left:20%;
	}


}

@media only screen and (max-width: 1200px) and (min-width: 901px){
	.contentbg{
		width:100%;
		height:auto;
		height:1600px;
	}
	
	.content1{
		width:35%;
		height:auto;
		float:left;	
	}
	
	.content2{
		width:45%;
		height:auto;
		float:left;
	}

}

@media only screen and (max-width: 900px) and (min-width: 769px) {
	.contentbg{
		width:100%;
		height:auto;
		height:1600px;
	}
	
	.content1{
		width:35%;
		height:auto;
		float:left;	
	}
	
	.content2{
		width:45%;
		height:auto;
		float:left;
	}
	
	.title h1{
		font-size:30px;
		float:left;
		text-align:left;
		margin-left:11%;
	}
	
	.text1{
		margin-top:5%;
	}

}


@media only screen and (max-width: 768px) and (min-width: 481px){
	.contentbg{
		width:100%;
		height:auto;
		height:1600px;
	}
	.content1{
		width:40%;
		height:auto;
		float:left;
		margin-left:5%;	
	}
	
	.content2{
		width:45%;
		height:auto;
		float:left;
		margin-left:5%;
	}
	
	.title h1{
		width:88%;
		font-size:28px;
		float:left;
		text-align:left;
		margin-left:11%;
	}
	
	.text1{
		margin-top:5%;
	}

}

@media only screen and (max-width: 480px) and (min-width: 321px){
	.contentbg{
		width:100%;
		height:2100px;
	}
	
	.content1{
		width:80%;
		height:auto;
		float:left;	
		margin-left:12%;
	}
	
	.content2{
		width:78%;
		height:auto;
		float:left;
		margin-left:12%;
	}
	
	.title{
		height:40px;
	}
	
	.title h1{
		width:88%;
		font-size:32px;
		float:left;
		text-align:left;
		margin-left:10%;
	}
	
	.text1{
		width:90%;
	}

}
	
@media only screen and (max-width: 320px){
	.contentbg{
		width:100%;
		height:1950px;
	}
	
	.content1{
		width:80%;
		height:auto;
		float:left;	
		margin-left:11%;
	}
	
	.content2{
		width:80%;
		height:auto;
		float:left;
		margin-left:11%;
	}
	
	.title{
		height:40px;
	}
	
	.title h1{
		width:88%;
		font-size:30px;
		float:left;
		text-align:left;
		margin-left:13%;
	}
	
	.text1{
		width:90%;
		height:auto;
	}
	
	.text1 h2{
		font-size:21px;
	}

}